@import '~antd/es/style/themes/default.less';

.SideChartDiv {
  position: relative;
  height: 49%;
  margin-bottom: 4%;
  overflow: hidden;
  background-color: rgba(8, 28, 49, 0.6);
  border: 2px solid rgba(36, 81, 156, 0.8);
  border-radius: 8px;
  .container {
    width: 100%;
    // height: 90%;
    padding-top: 1%;
    padding-left: 5%;
    font-weight: bold;
    font-size: calc((100vh - 48px) * 0.842 * 0.032);
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background: linear-gradient(to right, rgba(32, 60, 94, 1), rgba(5, 18, 33, 0.5));
  }
}

.SideChartDiv::before {
  position: absolute;
  top: -50%;
  left: -50%;
  width: 100%;
  height: 100%;
  background: linear-gradient(0deg, transparent, #1890ff, #1890ff);
  transform-origin: bottom right;
  animation: animate 6s linear infinite;
  animation-delay: -3s;
  content: '';
}
.SideChartDiv::after {
  position: absolute;
  top: -50%;
  left: -50%;
  width: 100%;
  height: 100%;
  background: linear-gradient(0deg, transparent, #1890ff, #1890ff);
  transform-origin: bottom right;
  animation: animate 6s linear infinite;
  content: '';
}
@keyframes animate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.ChartCard {
  position: absolute;
  z-index: 10;
  width: 100%;
  height: calc(100% - 2px);
  color: #0b80f1;
  background-color: rgba(8, 28, 49, 1);
  border-radius: 8px;
  // background-color: rgba(8, 28, 49, 1);
  inset: 1px;
}

.ChartCardTitle {
  background-color: aqua;
  .ant-card {
    .ant-card-head-wrapper .ant-card-head-title {
      padding: 0;
    }
  }
}

.T_Chart {
  width: 100%;
  height: 80%;
}
